<template>
  <view class="home">
    <home-swiper :banners="banners" @bannerItemClick="handleBannerItemCLick"></home-swiper>
    <home-recommend :recommends="recommends" />
    <home-popular></home-popular>
    <tab-control :titles="['流行', '新款', '精选']" @tabItemClick="handleTabItemClick"></tab-control>
  </view>
</template>

<script setup>
  import { onLoad } from '@dcloudio/uni-app'
  import { storeToRefs } from 'pinia'
  
  import useHomeStore from '@/store/home.js'
  
  import HomeSwiper from './childCpns/home-swiper.vue'
  import HomeRecommend from './childCpns/home-recommend.vue'
  import HomePopular from './childCpns/home-popular.vue'
  
  // 获取pinia数据
  const homeStore = useHomeStore()
  const { banners, recommends } = storeToRefs(homeStore)
  onLoad(() => {
    // 轮播图数据
    homeStore.fetchHomeMultidata()
  })
  
  // 轮播点击
  function handleBannerItemCLick(link) {
    uni.navigateTo({
      url: `/pages/webview/webview?link=` + link
    })
  }
  
  // 首页列表tab-control切换
  const handleTabItemClick = (index) => {
    console.log(index);
  }
</script>

<style lang="less">
  .home {
    margin-bottom: 5000rpx;
  }
</style>
